<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        html, body {
            width: 100%
        }
        .modal-backdrop {
            opacity: 0 !important;
            filter: alpha(opacity=0) !important;
        }
    </style>
    <link rel="stylesheet" href="../static/css/style.css">

    <script src="../js/jquery-2.1.1.min.js"></script>
    <!-- 新 Bootstrap4 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/bootstrap-table.min.css">
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>

    <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <script src="../static/js/global.min.js"></script>
    <script src="../js/bootstrap-table.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/bootstrap-table/1.21.0/locale/bootstrap-table-zh-CN.js"></script>
    <script>
        //渲染表格
        $(function () {
            $('#table').bootstrapTable({
                //请求方式  get请求中文会乱码，建议使用post请求
                method: 'post',
                //请求头部的设置
                contentType: 'application/json',
                //路径
                url: '/queryProductConfigureAll.action',
                //设置交替行样式
                striped: true,
                //初始显示页号
                pageNumber: 1,
                //设置表格高度
                height: 600,
                //是否显示分页
                pagination: true,
                //设置是服务端分页还是客户端分页
                sidePagination: 'server',
                //页大小
                pageSize:4,
                //分页列表
                pageList:[4,8],
                //上传到服务端的参数
                queryParams: function (params) {
                    return {
                        // 计算页号(当前页)
                        pageNum: (params.offset / params.limit) + 1,
                        // 计算页大小
                        pageSize: params.limit,

                    };
                },
                // 定义列名
                columns: [
                    {title: '产品编号', field: 'productId', align: 'center'},
                    {title: '产品名称', field: 'productName', align: 'center'},
                    {title: '用途类型', field: 'type', align: 'center',formatter:function (value,row,index){
                        if(value==="Y001-1"){
                            return "商品";
                        }else{
                            return "物料";
                        }
                    }},
                    {title: '档次级别', field: 'productClass', align: 'center',formatter:function (value,row,index){
                            if(value==="D001-1"){
                                return "高档";
                            }else if (value==="D001-2"){
                                return "中档";
                            }else {
                                return "低档";
                            }
                        }},
                    {title: 'I级分类', field: 'firstKindName', align: 'center'},
                    {title: 'II级分类', field: 'secondKindName', align: 'center'},
                    {title: 'III级分类', field: 'thirdKindName', align: 'center'},
                    {title: '制定', field: 'id', align: 'center',
                        formatter: function (value,row,index) {
                            return "<button class=\"btn btn-primary\" onclick='make("+JSON.stringify(row)+")'>制定</button>";
                        },
                    }
                ]
            });
        })
        var dFile="";
        //制定安全库存配置单
        function make(obj){
            $.ajax({
                type:'POST',
                url: '/userShow.action',
                success:function (user){
                    //产品设计人
                    $('#d_register').val(obj.register);
                    //产品名称
                    $('#productName').val(obj.productName);
                    //产品编号
                    $('#productId').val(obj.productId);
                    //安全库存配置单 登记人
                    $('#s_register').val(user.loginId);
                    //安全库存配置单 时间
                    let date = new Date();
                    $('#register_time').val(date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate()+" "+date.getHours()+":"+date.getMinutes()+":"+date.getSeconds());
                    //赋值到元素标签后打开模态框
                    $('#exampleModal').modal("show");
                    //产品单位
                    $('#unit').val(obj.personalUnit);
                    dFile=obj;
                }
            })
        }
        //提交 制定安全库存配置单
        $(function (){
            $('#save').click(function (){
                let f = true;
                if($('#min_amount').val()<1){
                    alert("库存报警下限数不能为0 ！！！");
                    f = false;
                }
                if($('#max_amount').val()<$('#min_amount').val()){
                    alert("库存报警上限数小于库存报警下限数 ！！！");
                    f = false;
                }
                if($('#amount').val()<$('#max_amount').val()){
                    alert("最大存储量小于库存报警上限数 ！！！");
                    f = false;
                }
                if(f===true){
                    let stock_cell_Obj={
                        productId:$('#productId').val(),//产品编号
                        productName:$('#productName').val(),//产品名称
                        firstKindId:dFile.firstKindId,//产品i级分类编号
                        firstKindName:dFile.firstKindName,//产品i级分类名称
                        secondKindId:dFile.secondKindId,//产品ii级分类编号
                        secondKindName:dFile.secondKindName,//产品ii级分类名称
                        thirdKindId:dFile.thirdKindId,//产品iii级分类编号
                        thirdKindName:dFile.thirdKindName,//产品iii级分类名称
                        minAmount:$('#min_amount').val(),//库存报警下限数
                        maxAmount:$('#max_amount').val(),//库存报警上限数
                        maxCapacityAmount:$('#amount').val(),//最大存储量
                        config:$('#config').val(),//配置要求
                        register:$('#s_register').val(),//登记人
                        registerTime:$('#register_time').val(),//登记时间
                        unit:$('#unit').val(),//存储单位
                    }
                    $.ajax({
                        type:'POST',
                        contentType:'application/json;charset=utf-8',
                        url:'/constituteSCell.action',
                        data:JSON.stringify(stock_cell_Obj),
                        success:function (result){
                            if(result>0){
                                $('#exampleModal').modal("hide");
                                alert("成功操作一条数据");
                                $('#table').bootstrapTable("refresh");
                            }else {
                                alert("操作一条数据失败");
                            }
                        }
                    });
                }
            });
        })
    </script>
</head>
<body>
<div class="form-inline breadcrumb" style="margin: 0 auto;width: 90%;background-color: white;">
    <label class="mb-2 mr-sm-2">I级分类</label>
    <select class="form-control mb-2 mr-sm-2">
        <option value="">--请选择--</option>
        <option value="">电子</option>
    </select>

    <label class="mb-2 mr-sm-2">II级分类</label>
    <select class="form-control mb-2 mr-sm-2">
        <option value="">--请选择--</option>
        <option value="">电子/计算机</option>
    </select>

    <label class="mb-2 mr-sm-2">II级分类</label>
    <select class="form-control mb-2 mr-sm-2">
        <option value="">--请选择--</option>
        <option value="">电子/计算机/服务器</option>
    </select>

    <label class="mb-2 mr-sm-2">设计时间:</label>

    <input type="date" class="form-control mb-2 mr-sm-2" id="minDate">
    <input type="date" class="form-control mb-2 mr-sm-2" id="maxDate">


    <button class="form-control mb-2 mr-sm-2" id="pageQuery">搜索</button>
</div>

<table id="table"></table>

<div class="modal fade" id="exampleModal" tabindex="-1" style="display: none;" aria-hidden="true">
    <div class="modal-dialog modal-lg" style="width: 100%;">
        <div class="modal-content" style="width: 100%;">
            <div class="modal-header">
                <h2 class="modal-title" id="exampleModalLabel" style="width: 100%;text-align: center;">安全库存配置单</h2>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="关闭"></button>
            </div>


            <div class="modal-body">

                <div style="display: flex;">
                    <div class="input-group mb-2">
                        <div class="input-group-text">产品名称<span class="text-danger scale5 ms-2">*</span></div>
                        <input id="productName" type="text" class="form-control" style="background-color: white;" readonly>
                    </div>
                    <div style="width: 40px;"></div>
                    <div class="input-group mb-2">
                        <div class="input-group-text">产品编号<span class="text-danger scale5 ms-2">*</span></div>
                        <input id="productId" type="text" class="form-control" style="background-color: white;" readonly>
                    </div>
                </div>

                <div style="display: flex;">
                    <div class="input-group mb-2">
                        <div class="input-group-text">库存报警下限数<span class="text-danger scale5 ms-2">*</span></div>
                        <input id="min_amount" type="number" value="1000" class="form-control">
                    </div>
                    <div style="width: 40px;"></div>
                    <div class="input-group mb-2">
                        <div class="input-group-text">库存报警上限数<span class="text-danger scale5 ms-2">*</span></div>
                        <input id="max_amount" type="number" value="5000" class="form-control">
                    </div>
                </div>

                <div>
                    <table class="table table-bordered">
                        <thead>
                        <tr class="text-center">
                            <th style="font-weight: bold;">序号</th>
                            <th style="font-weight: bold;">库房名称</th>
                            <th style="font-weight: bold;">存储地址编号</th>
                            <th style="font-weight: bold;">存储地址名称</th>
                            <th style="font-weight: bold;">最大存储量<span class="text-danger scale5 ms-2">*</span></th>
                            <th style="font-weight: bold;">存储单位</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr class="text-center">
                            <td>1</td>
                            <td>成品库</td>
                            <td>01-01-01</td>
                            <td>电子-计算机-服务器</td>
                            <td><input id="amount" type="number" value="8000" class="form-control" style="text-align: center;" ></td>
                            <td><input id="unit" type="text" class="form-control" style="text-align: center; background-color: white;" readonly></td>
                        </tr>
                        </tbody>
                    </table>
                </div>

                <div style="display: flex;">
                    <div class="input-group mb-2">
                        <div class="input-group-text">设计人<span class="text-danger scale5 ms-2">*</span></div>
                        <input id="d_register" type="text" class="form-control" style="background-color: white;" readonly>
                    </div>
                    <div style="width: 40px;"></div>
                    <div class="input-group mb-2">
                        <div class="input-group-text">登记人<span class="text-danger scale5 ms-2">*</span></div>
                        <input id="s_register" type="text" class="form-control" style="background-color: white;" readonly>
                    </div>
                </div>

                <div>
                    <div class="input-group mb-2">
                        <div class="input-group-text">登记时间<span class="text-danger scale5 ms-2">*</span></div>
                        <input id="register_time" type="text" class="form-control" style="background-color: white;" readonly>
                    </div>
                </div>
                <div>
                    <div class="input-group mb-2">
                        <div class="input-group-text">描述</div>
                        <textarea id="config" class="form-control solid" style="height: 100px;"></textarea>
                    </div>
                </div>
            </div>

            <div class="modal-footer">
                <button id="save" type="button" class="btn btn-primary"><i class="fas fa-check text-success" style="margin-right: 5px;"></i>制定</button>
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><i class="fas fa-times text-danger" style="margin-right: 5px;"></i>取消</button>
            </div>
        </div>
    </div>
</div>

</body>
</html>